{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# boss_analysis + pyecharts"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## 1. 数据获取\n",
    "\n",
    "BOSS直聘上有这么一个接口，可以很好的获取当前不同岗位，不同城市的薪资水平\n",
    "\n",
    "https://www.zhipin.com/wapi/zpboss/h5/marketpay/statistics.json"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "参数\n",
    "- java:position=100101\n",
    "- 产品经理:position=110101\n",
    "- python:position=100109"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [],
   "source": [
    "import requests\n",
    "headers = {'accept': 'application/json, text/plain, */*',\n",
    "          'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 11_0_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36'}\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {},
   "outputs": [],
   "source": [
    "querystring = {\"positionId\":\"130102\",\"industryId\":\"0\",\"cityId\":\"0\",\"companySize\":\"0\",\"financingStage\":\"0\",\"experienceCode\":\"0\"}\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {},
   "outputs": [],
   "source": [
    "job_statics_url = 'https://www.zhipin.com/wapi/zpboss/h5/marketpay/statistics.json'"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [],
   "source": [
    "job_statics_data = requests.get(job_statics_url, params=querystring, headers=headers)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "{'code': 0,\n",
       " 'message': 'Success',\n",
       " 'zpData': {'positionId': 130102,\n",
       "  'industryId': 0,\n",
       "  'cityId': 0,\n",
       "  'companySize': 0,\n",
       "  'financingStage': 0,\n",
       "  'experienceCode': 0,\n",
       "  'sampleCount': 1498406,\n",
       "  'sampleInsufficient': False,\n",
       "  'salaryByMonth': [{'year': '2020年',\n",
       "    'showYear': True,\n",
       "    'month': '3月',\n",
       "    'monthAveSalary': 5949,\n",
       "    'title': 'Mar',\n",
       "    'grow': False,\n",
       "    'percent': 4.89,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '4月',\n",
       "    'monthAveSalary': 5836,\n",
       "    'title': 'Apr',\n",
       "    'grow': False,\n",
       "    'percent': 1.9,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '5月',\n",
       "    'monthAveSalary': 5826,\n",
       "    'title': 'May',\n",
       "    'grow': False,\n",
       "    'percent': 0.17,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '6月',\n",
       "    'monthAveSalary': 5815,\n",
       "    'title': 'Jun',\n",
       "    'grow': False,\n",
       "    'percent': 0.19,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '7月',\n",
       "    'monthAveSalary': 5731,\n",
       "    'title': 'Jul',\n",
       "    'grow': False,\n",
       "    'percent': 1.44,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '8月',\n",
       "    'monthAveSalary': 5852,\n",
       "    'title': 'Aug',\n",
       "    'grow': True,\n",
       "    'percent': 2.11,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '9月',\n",
       "    'monthAveSalary': 5961,\n",
       "    'title': 'Sept',\n",
       "    'grow': True,\n",
       "    'percent': 1.86,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '10月',\n",
       "    'monthAveSalary': 6079,\n",
       "    'title': 'Oct',\n",
       "    'grow': True,\n",
       "    'percent': 1.98,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '11月',\n",
       "    'monthAveSalary': 6076,\n",
       "    'title': 'Nov',\n",
       "    'grow': False,\n",
       "    'percent': 0.05,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2020年',\n",
       "    'showYear': False,\n",
       "    'month': '12月',\n",
       "    'monthAveSalary': 6213,\n",
       "    'title': 'Dec',\n",
       "    'grow': True,\n",
       "    'percent': 2.25,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2021年',\n",
       "    'showYear': True,\n",
       "    'month': '1月',\n",
       "    'monthAveSalary': 6392,\n",
       "    'title': 'Jan',\n",
       "    'grow': True,\n",
       "    'percent': 2.88,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0},\n",
       "   {'year': '2021年',\n",
       "    'showYear': False,\n",
       "    'month': '2月',\n",
       "    'monthAveSalary': 6292,\n",
       "    'title': 'Feb',\n",
       "    'grow': False,\n",
       "    'percent': 1.56,\n",
       "    'effectiveJobCount': 0,\n",
       "    'effectiveJobGrowthRatio': 0.0,\n",
       "    'effectiveJobGrowthOneMonth': 0,\n",
       "    'effectiveJobGrowthTwoMonth': 0}],\n",
       "  'salaryByAge': [{'ageRange': '24岁以下',\n",
       "    'percent': 41,\n",
       "    'people': 618717,\n",
       "    'percentDecimal': 0.412917,\n",
       "    'index': 0},\n",
       "   {'ageRange': '25岁-29岁',\n",
       "    'percent': 44,\n",
       "    'people': 658818,\n",
       "    'percentDecimal': 0.439679,\n",
       "    'index': 1},\n",
       "   {'ageRange': '30岁-34岁',\n",
       "    'percent': 12,\n",
       "    'people': 182196,\n",
       "    'percentDecimal': 0.121593,\n",
       "    'index': 2},\n",
       "   {'ageRange': '35岁-39岁',\n",
       "    'percent': 2,\n",
       "    'people': 31708,\n",
       "    'percentDecimal': 0.021161,\n",
       "    'index': 3},\n",
       "   {'ageRange': '40岁-44岁',\n",
       "    'percent': 0,\n",
       "    'people': 4971,\n",
       "    'percentDecimal': 0.003318,\n",
       "    'index': 4},\n",
       "   {'ageRange': '45岁以上',\n",
       "    'percent': 1,\n",
       "    'people': 1996,\n",
       "    'percentDecimal': 0.001332,\n",
       "    'index': 5}],\n",
       "  'salaryByWorkExp': [{'percent': 5,\n",
       "    'aveSalary': 4763,\n",
       "    'workExp': '1年以内',\n",
       "    'percentDecimal': 0.050668,\n",
       "    'index': 0},\n",
       "   {'percent': 58,\n",
       "    'aveSalary': 5733,\n",
       "    'workExp': '1-3年',\n",
       "    'percentDecimal': 0.576893,\n",
       "    'index': 1},\n",
       "   {'percent': 30,\n",
       "    'aveSalary': 7663,\n",
       "    'workExp': '3-5年',\n",
       "    'percentDecimal': 0.304177,\n",
       "    'index': 2},\n",
       "   {'percent': 7,\n",
       "    'aveSalary': 10218,\n",
       "    'workExp': '5-10年',\n",
       "    'percentDecimal': 0.06636,\n",
       "    'index': 3},\n",
       "   {'percent': 0,\n",
       "    'aveSalary': 14839,\n",
       "    'workExp': '10年以上',\n",
       "    'percentDecimal': 0.001902,\n",
       "    'index': 4}],\n",
       "  'salaryByDistributed': [{'salaryRange': '<5.42',\n",
       "    'percent': 24,\n",
       "    'people': 0,\n",
       "    'percentDecimal': 0.239605,\n",
       "    'index': 0},\n",
       "   {'salaryRange': '5.42-7.50',\n",
       "    'percent': 29,\n",
       "    'people': 0,\n",
       "    'percentDecimal': 0.290056,\n",
       "    'index': 1},\n",
       "   {'salaryRange': '7.50-9.58',\n",
       "    'percent': 20,\n",
       "    'people': 0,\n",
       "    'percentDecimal': 0.204923,\n",
       "    'index': 2},\n",
       "   {'salaryRange': '9.58-11.66',\n",
       "    'percent': 12,\n",
       "    'people': 0,\n",
       "    'percentDecimal': 0.115958,\n",
       "    'index': 3},\n",
       "   {'salaryRange': '>11.66',\n",
       "    'percent': 15,\n",
       "    'people': 0,\n",
       "    'percentDecimal': 0.149025,\n",
       "    'index': 4}],\n",
       "  'salaryByPoints': [{'name': '10分位',\n",
       "    'title': '低端',\n",
       "    'salary': 43844,\n",
       "    'point': 10},\n",
       "   {'name': '25分位', 'title': '中低端', 'salary': 56205, 'point': 25},\n",
       "   {'name': '50分位', 'title': '中端', 'salary': 73763, 'point': 50},\n",
       "   {'name': '75分位', 'title': '中高端', 'salary': 97572, 'point': 75},\n",
       "   {'name': '90分位', 'title': '高端', 'salary': 127017, 'point': 90}],\n",
       "  'salaryByCity': [{'provinceId': 101010000,\n",
       "    'provinceAveMonthSalary': 12061,\n",
       "    'provinceName': '北京',\n",
       "    'cityList': [{'cityId': 101010100,\n",
       "      'cityName': '北京',\n",
       "      'cityAveMonthSalary': 12061}]},\n",
       "   {'provinceId': 101020000,\n",
       "    'provinceAveMonthSalary': 11113,\n",
       "    'provinceName': '上海',\n",
       "    'cityList': [{'cityId': 101020100,\n",
       "      'cityName': '上海',\n",
       "      'cityAveMonthSalary': 11113}]},\n",
       "   {'provinceId': 101030000,\n",
       "    'provinceAveMonthSalary': 5662,\n",
       "    'provinceName': '天津',\n",
       "    'cityList': [{'cityId': 101030100,\n",
       "      'cityName': '天津',\n",
       "      'cityAveMonthSalary': 5662}]},\n",
       "   {'provinceId': 101040000,\n",
       "    'provinceAveMonthSalary': 5397,\n",
       "    'provinceName': '重庆',\n",
       "    'cityList': [{'cityId': 101040100,\n",
       "      'cityName': '重庆',\n",
       "      'cityAveMonthSalary': 5397}]},\n",
       "   {'provinceId': 101050000,\n",
       "    'provinceAveMonthSalary': 5164,\n",
       "    'provinceName': '黑龙江',\n",
       "    'cityList': [{'cityId': 101050100,\n",
       "      'cityName': '哈尔滨',\n",
       "      'cityAveMonthSalary': 5164}]},\n",
       "   {'provinceId': 101060000,\n",
       "    'provinceAveMonthSalary': 5831,\n",
       "    'provinceName': '吉林',\n",
       "    'cityList': [{'cityId': 101060100,\n",
       "      'cityName': '长春',\n",
       "      'cityAveMonthSalary': 5831}]},\n",
       "   {'provinceId': 101070000,\n",
       "    'provinceAveMonthSalary': 5237,\n",
       "    'provinceName': '辽宁',\n",
       "    'cityList': [{'cityId': 101070100,\n",
       "      'cityName': '沈阳',\n",
       "      'cityAveMonthSalary': 4923},\n",
       "     {'cityId': 101070200, 'cityName': '大连', 'cityAveMonthSalary': 5552}]},\n",
       "   {'provinceId': 101090000,\n",
       "    'provinceAveMonthSalary': 5370,\n",
       "    'provinceName': '河北',\n",
       "    'cityList': [{'cityId': 101090100,\n",
       "      'cityName': '石家庄',\n",
       "      'cityAveMonthSalary': 5102},\n",
       "     {'cityId': 101090200, 'cityName': '保定', 'cityAveMonthSalary': 4976},\n",
       "     {'cityId': 101090600, 'cityName': '廊坊', 'cityAveMonthSalary': 6034}]},\n",
       "   {'provinceId': 101100000,\n",
       "    'provinceAveMonthSalary': 4968,\n",
       "    'provinceName': '山西',\n",
       "    'cityList': [{'cityId': 101100100,\n",
       "      'cityName': '太原',\n",
       "      'cityAveMonthSalary': 4968}]},\n",
       "   {'provinceId': 101110000,\n",
       "    'provinceAveMonthSalary': 6108,\n",
       "    'provinceName': '陕西',\n",
       "    'cityList': [{'cityId': 101110100,\n",
       "      'cityName': '西安',\n",
       "      'cityAveMonthSalary': 6108}]},\n",
       "   {'provinceId': 101120000,\n",
       "    'provinceAveMonthSalary': 5547,\n",
       "    'provinceName': '山东',\n",
       "    'cityList': [{'cityId': 101120100,\n",
       "      'cityName': '济南',\n",
       "      'cityAveMonthSalary': 5510},\n",
       "     {'cityId': 101120200, 'cityName': '青岛', 'cityAveMonthSalary': 6053},\n",
       "     {'cityId': 101120500, 'cityName': '烟台', 'cityAveMonthSalary': 5080}]},\n",
       "   {'provinceId': 101160000,\n",
       "    'provinceAveMonthSalary': 5110,\n",
       "    'provinceName': '甘肃',\n",
       "    'cityList': [{'cityId': 101160100,\n",
       "      'cityName': '兰州',\n",
       "      'cityAveMonthSalary': 5110}]},\n",
       "   {'provinceId': 101180000,\n",
       "    'provinceAveMonthSalary': 5617,\n",
       "    'provinceName': '河南',\n",
       "    'cityList': [{'cityId': 101180100,\n",
       "      'cityName': '郑州',\n",
       "      'cityAveMonthSalary': 5617}]},\n",
       "   {'provinceId': 101190000,\n",
       "    'provinceAveMonthSalary': 6057,\n",
       "    'provinceName': '江苏',\n",
       "    'cityList': [{'cityId': 101190100,\n",
       "      'cityName': '南京',\n",
       "      'cityAveMonthSalary': 7858},\n",
       "     {'cityId': 101190200, 'cityName': '无锡', 'cityAveMonthSalary': 6196},\n",
       "     {'cityId': 101190400, 'cityName': '苏州', 'cityAveMonthSalary': 6758},\n",
       "     {'cityId': 101190500, 'cityName': '南通', 'cityAveMonthSalary': 5788},\n",
       "     {'cityId': 101190600, 'cityName': '扬州', 'cityAveMonthSalary': 4786},\n",
       "     {'cityId': 101190800, 'cityName': '徐州', 'cityAveMonthSalary': 5354},\n",
       "     {'cityId': 101191100, 'cityName': '常州', 'cityAveMonthSalary': 5662}]},\n",
       "   {'provinceId': 101200000,\n",
       "    'provinceAveMonthSalary': 6518,\n",
       "    'provinceName': '湖北',\n",
       "    'cityList': [{'cityId': 101200100,\n",
       "      'cityName': '武汉',\n",
       "      'cityAveMonthSalary': 6518}]},\n",
       "   {'provinceId': 101210000,\n",
       "    'provinceAveMonthSalary': 6198,\n",
       "    'provinceName': '浙江',\n",
       "    'cityList': [{'cityId': 101210100,\n",
       "      'cityName': '杭州',\n",
       "      'cityAveMonthSalary': 9428},\n",
       "     {'cityId': 101210300, 'cityName': '嘉兴', 'cityAveMonthSalary': 5306},\n",
       "     {'cityId': 101210400, 'cityName': '宁波', 'cityAveMonthSalary': 6008},\n",
       "     {'cityId': 101210500, 'cityName': '绍兴', 'cityAveMonthSalary': 5338},\n",
       "     {'cityId': 101210600, 'cityName': '台州', 'cityAveMonthSalary': 5651},\n",
       "     {'cityId': 101210700, 'cityName': '温州', 'cityAveMonthSalary': 6296},\n",
       "     {'cityId': 101210900, 'cityName': '金华', 'cityAveMonthSalary': 5357}]},\n",
       "   {'provinceId': 101220000,\n",
       "    'provinceAveMonthSalary': 5983,\n",
       "    'provinceName': '安徽',\n",
       "    'cityList': [{'cityId': 101220100,\n",
       "      'cityName': '合肥',\n",
       "      'cityAveMonthSalary': 5983}]},\n",
       "   {'provinceId': 101230000,\n",
       "    'provinceAveMonthSalary': 5182,\n",
       "    'provinceName': '福建',\n",
       "    'cityList': [{'cityId': 101230100,\n",
       "      'cityName': '福州',\n",
       "      'cityAveMonthSalary': 5684},\n",
       "     {'cityId': 101230200, 'cityName': '厦门', 'cityAveMonthSalary': 5940},\n",
       "     {'cityId': 101230500, 'cityName': '泉州', 'cityAveMonthSalary': 5182}]},\n",
       "   {'provinceId': 101240000,\n",
       "    'provinceAveMonthSalary': 5117,\n",
       "    'provinceName': '江西',\n",
       "    'cityList': [{'cityId': 101240100,\n",
       "      'cityName': '南昌',\n",
       "      'cityAveMonthSalary': 4988}]},\n",
       "   {'provinceId': 101250000,\n",
       "    'provinceAveMonthSalary': 5683,\n",
       "    'provinceName': '湖南',\n",
       "    'cityList': [{'cityId': 101250100,\n",
       "      'cityName': '长沙',\n",
       "      'cityAveMonthSalary': 5683}]},\n",
       "   {'provinceId': 101260000,\n",
       "    'provinceAveMonthSalary': 4891,\n",
       "    'provinceName': '贵州',\n",
       "    'cityList': [{'cityId': 101260100,\n",
       "      'cityName': '贵阳',\n",
       "      'cityAveMonthSalary': 4891}]},\n",
       "   {'provinceId': 101270000,\n",
       "    'provinceAveMonthSalary': 6479,\n",
       "    'provinceName': '四川',\n",
       "    'cityList': [{'cityId': 101270100,\n",
       "      'cityName': '成都',\n",
       "      'cityAveMonthSalary': 6479}]},\n",
       "   {'provinceId': 101280000,\n",
       "    'provinceAveMonthSalary': 6412,\n",
       "    'provinceName': '广东',\n",
       "    'cityList': [{'cityId': 101280100,\n",
       "      'cityName': '广州',\n",
       "      'cityAveMonthSalary': 7081},\n",
       "     {'cityId': 101280300, 'cityName': '惠州', 'cityAveMonthSalary': 4923},\n",
       "     {'cityId': 101280600, 'cityName': '深圳', 'cityAveMonthSalary': 9233},\n",
       "     {'cityId': 101280700, 'cityName': '珠海', 'cityAveMonthSalary': 6520},\n",
       "     {'cityId': 101280800, 'cityName': '佛山', 'cityAveMonthSalary': 5700},\n",
       "     {'cityId': 101281600, 'cityName': '东莞', 'cityAveMonthSalary': 6104},\n",
       "     {'cityId': 101281700, 'cityName': '中山', 'cityAveMonthSalary': 5322}]},\n",
       "   {'provinceId': 101290000,\n",
       "    'provinceAveMonthSalary': 4845,\n",
       "    'provinceName': '云南',\n",
       "    'cityList': [{'cityId': 101290100,\n",
       "      'cityName': '昆明',\n",
       "      'cityAveMonthSalary': 4845}]},\n",
       "   {'provinceId': 101300000,\n",
       "    'provinceAveMonthSalary': 4676,\n",
       "    'provinceName': '广西',\n",
       "    'cityList': [{'cityId': 101300100,\n",
       "      'cityName': '南宁',\n",
       "      'cityAveMonthSalary': 4676}]},\n",
       "   {'provinceId': 101310000,\n",
       "    'provinceAveMonthSalary': 5290,\n",
       "    'provinceName': '海南',\n",
       "    'cityList': [{'cityId': 101310100,\n",
       "      'cityName': '海口',\n",
       "      'cityAveMonthSalary': 5290}]},\n",
       "   {'provinceId': 101080000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '内蒙古',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101130000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '新疆',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101150000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '青海',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101170000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '宁夏',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101340000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '台湾',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101140000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '西藏',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101320000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '香港',\n",
       "    'cityList': None},\n",
       "   {'provinceId': 101330000,\n",
       "    'provinceAveMonthSalary': 0,\n",
       "    'provinceName': '澳门',\n",
       "    'cityList': None}],\n",
       "  'lastUpdateTime': '2021年03月04日'}}"
      ]
     },
     "execution_count": 5,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "job_statics_data.json()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## 2. 数据分析可视化\n",
    "### 薪资分位值\n",
    "\n",
    "在我们获取到的数据当中，就有分位值的数据，可以方便的获取"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "[{'name': '10分位', 'title': '低端', 'salary': 43844, 'point': 10},\n",
       " {'name': '25分位', 'title': '中低端', 'salary': 56205, 'point': 25},\n",
       " {'name': '50分位', 'title': '中端', 'salary': 73763, 'point': 50},\n",
       " {'name': '75分位', 'title': '中高端', 'salary': 97572, 'point': 75},\n",
       " {'name': '90分位', 'title': '高端', 'salary': 127017, 'point': 90}]"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "job_statics_data_json = job_statics_data.json()\n",
    "job_statics_data_json['zpData']['salaryByPoints']"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 薪资分位 - 折线图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {},
   "outputs": [],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByPoints']:\n",
    "    statics_x.append(i['name'] + '\\n' + i['title'])\n",
    "    statics_y.append(i['salary'])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {},
   "outputs": [],
   "source": [
    "import pyecharts.options as opts\n",
    "from pyecharts.charts import Line, Bar, Pie, Calendar, WordCloud\n",
    "from pyecharts.commons.utils import JsCode\n",
    "from pyecharts.globals import SymbolType\n",
    "import datetime\n",
    "import random"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {},
   "outputs": [],
   "source": [
    "x_data = statics_x\n",
    "y_data = statics_y\n",
    "\n",
    "background_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    ")\n",
    "area_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#eb64fb'}, {offset: 1, color: '#3fbbff0d'}], false)\"\n",
    ")\n",
    "\n",
    "c_line = (\n",
    "    Line(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "    .add_xaxis(xaxis_data=x_data)\n",
    "    .add_yaxis(\n",
    "        series_name=\"薪资\",\n",
    "        y_axis=y_data,\n",
    "        is_smooth=True,\n",
    "        is_symbol_show=True,\n",
    "        symbol=\"circle\",\n",
    "        symbol_size=6,\n",
    "        linestyle_opts=opts.LineStyleOpts(color=\"#fff\"),\n",
    "        label_opts=opts.LabelOpts(is_show=True, position=\"top\", color=\"white\"),\n",
    "        itemstyle_opts=opts.ItemStyleOpts(\n",
    "            color=\"red\", border_color=\"#fff\", border_width=3\n",
    "        ),\n",
    "        tooltip_opts=opts.TooltipOpts(is_show=False),\n",
    "        areastyle_opts=opts.AreaStyleOpts(color=JsCode(area_color_js), opacity=1),\n",
    "    )\n",
    "    .set_global_opts(\n",
    "        title_opts=opts.TitleOpts(\n",
    "            title=\"收入分位\",\n",
    "            pos_bottom=\"5%\",\n",
    "            pos_left=\"center\",\n",
    "            title_textstyle_opts=opts.TextStyleOpts(color=\"#fff\", font_size=16),\n",
    "        ),\n",
    "        xaxis_opts=opts.AxisOpts(\n",
    "            type_=\"category\",\n",
    "            boundary_gap=False,\n",
    "            axislabel_opts=opts.LabelOpts(margin=30, color=\"#ffffff63\"),\n",
    "            axisline_opts=opts.AxisLineOpts(is_show=False),\n",
    "            axistick_opts=opts.AxisTickOpts(\n",
    "                is_show=True,\n",
    "                length=25,\n",
    "                linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "            ),\n",
    "            splitline_opts=opts.SplitLineOpts(\n",
    "                is_show=True, linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\")\n",
    "            ),\n",
    "        ),\n",
    "        yaxis_opts=opts.AxisOpts(\n",
    "            type_=\"value\",\n",
    "            position=\"right\",\n",
    "            axislabel_opts=opts.LabelOpts(margin=20, color=\"#ffffff63\"),\n",
    "            axisline_opts=opts.AxisLineOpts(\n",
    "                linestyle_opts=opts.LineStyleOpts(width=2, color=\"#fff\")\n",
    "            ),\n",
    "            axistick_opts=opts.AxisTickOpts(\n",
    "                is_show=True,\n",
    "                length=15,\n",
    "                linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "            ),\n",
    "            splitline_opts=opts.SplitLineOpts(\n",
    "                is_show=True, linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\")\n",
    "            ),\n",
    "        ),\n",
    "        legend_opts=opts.LegendOpts(is_show=False),\n",
    "    )\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"fdf6a734c09943078f9928e8af660dd9\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_fdf6a734c09943078f9928e8af660dd9 = echarts.init(\n",
       "                    document.getElementById('fdf6a734c09943078f9928e8af660dd9'), 'white', {renderer: 'canvas'});\n",
       "                var option_fdf6a734c09943078f9928e8af660dd9 = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"line\",\n",
       "            \"name\": \"\\u85aa\\u8d44\",\n",
       "            \"connectNulls\": false,\n",
       "            \"symbol\": \"circle\",\n",
       "            \"symbolSize\": 6,\n",
       "            \"showSymbol\": true,\n",
       "            \"smooth\": true,\n",
       "            \"clip\": true,\n",
       "            \"step\": false,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"10\\u5206\\u4f4d\\n\\u4f4e\\u7aef\",\n",
       "                    43844\n",
       "                ],\n",
       "                [\n",
       "                    \"25\\u5206\\u4f4d\\n\\u4e2d\\u4f4e\\u7aef\",\n",
       "                    56205\n",
       "                ],\n",
       "                [\n",
       "                    \"50\\u5206\\u4f4d\\n\\u4e2d\\u7aef\",\n",
       "                    73763\n",
       "                ],\n",
       "                [\n",
       "                    \"75\\u5206\\u4f4d\\n\\u4e2d\\u9ad8\\u7aef\",\n",
       "                    97572\n",
       "                ],\n",
       "                [\n",
       "                    \"90\\u5206\\u4f4d\\n\\u9ad8\\u7aef\",\n",
       "                    127017\n",
       "                ]\n",
       "            ],\n",
       "            \"hoverAnimation\": true,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"white\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"lineStyle\": {\n",
       "                \"show\": true,\n",
       "                \"width\": 1,\n",
       "                \"opacity\": 1,\n",
       "                \"curveness\": 0,\n",
       "                \"type\": \"solid\",\n",
       "                \"color\": \"#fff\"\n",
       "            },\n",
       "            \"areaStyle\": {\n",
       "                \"opacity\": 1,\n",
       "                \"color\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#eb64fb'}, {offset: 1, color: '#3fbbff0d'}], false)\n",
       "            },\n",
       "            \"tooltip\": {\n",
       "                \"show\": false,\n",
       "                \"trigger\": \"item\",\n",
       "                \"triggerOn\": \"mousemove|click\",\n",
       "                \"axisPointer\": {\n",
       "                    \"type\": \"line\"\n",
       "                },\n",
       "                \"showContent\": true,\n",
       "                \"alwaysShowContent\": false,\n",
       "                \"showDelay\": 0,\n",
       "                \"hideDelay\": 100,\n",
       "                \"textStyle\": {\n",
       "                    \"fontSize\": 14\n",
       "                },\n",
       "                \"borderWidth\": 0,\n",
       "                \"padding\": 5\n",
       "            },\n",
       "            \"itemStyle\": {\n",
       "                \"color\": \"red\",\n",
       "                \"borderColor\": \"#fff\",\n",
       "                \"borderWidth\": 3\n",
       "            },\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 0\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u85aa\\u8d44\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u85aa\\u8d44\": true\n",
       "            },\n",
       "            \"show\": false,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"xAxis\": [\n",
       "        {\n",
       "            \"type\": \"category\",\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 25,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"#ffffff63\",\n",
       "                \"margin\": 30\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"boundaryGap\": false,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": true,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"10\\u5206\\u4f4d\\n\\u4f4e\\u7aef\",\n",
       "                \"25\\u5206\\u4f4d\\n\\u4e2d\\u4f4e\\u7aef\",\n",
       "                \"50\\u5206\\u4f4d\\n\\u4e2d\\u7aef\",\n",
       "                \"75\\u5206\\u4f4d\\n\\u4e2d\\u9ad8\\u7aef\",\n",
       "                \"90\\u5206\\u4f4d\\n\\u9ad8\\u7aef\"\n",
       "            ]\n",
       "        }\n",
       "    ],\n",
       "    \"yAxis\": [\n",
       "        {\n",
       "            \"type\": \"value\",\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": true,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 2,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#fff\"\n",
       "                }\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 15,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"#ffffff63\",\n",
       "                \"margin\": 20\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"position\": \"right\",\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": true,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"\\u6536\\u5165\\u5206\\u4f4d\",\n",
       "            \"left\": \"center\",\n",
       "            \"bottom\": \"5%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"textStyle\": {\n",
       "                \"color\": \"#fff\",\n",
       "                \"fontSize\": 16\n",
       "            }\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_fdf6a734c09943078f9928e8af660dd9.setOption(option_fdf6a734c09943078f9928e8af660dd9);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f722520>"
      ]
     },
     "execution_count": 10,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c_line.render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 薪资分布 - 横向柱形图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 11,
   "metadata": {},
   "outputs": [],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByDistributed']:\n",
    "    statics_y.append(i['percent'])\n",
    "    statics_x.append(i['salaryRange'])\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 12,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "['<5.42', '5.42-7.50', '7.50-9.58', '9.58-11.66', '>11.66']\n",
      "[24, 29, 20, 12, 15]\n"
     ]
    }
   ],
   "source": [
    "print(statics_x)\n",
    "print(statics_y)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 13,
   "metadata": {},
   "outputs": [],
   "source": [
    "def bar_chart(x, y) -> Bar:\n",
    "    background_color_js = (\n",
    "        \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "        \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    "    )\n",
    "    c = (\n",
    "        Bar(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "        #Bar()\n",
    "        .add_xaxis(x)\n",
    "        # .add_xaxis(searchcount.index.tolist()[:10])\n",
    "        .reversal_axis()\n",
    "        .add_yaxis(\"\", y, \n",
    "                   label_opts=opts.LabelOpts(position='inside', formatter=\"{c}%\"),\n",
    "                  color='plum', category_gap=\"60%\"\n",
    "                  )\n",
    "        .set_global_opts(xaxis_opts=opts.AxisOpts(axislabel_opts=opts.LabelOpts(rotate=-30, formatter=\"{value}%\"),\n",
    "                                                 axisline_opts=opts.AxisLineOpts(is_show=False),),\n",
    "                        yaxis_opts=opts.AxisOpts(\n",
    "                            axislabel_opts=opts.LabelOpts(is_show=True),\n",
    "                        axisline_opts=opts.AxisLineOpts(is_show=False),\n",
    "                        axistick_opts=opts.AxisTickOpts(\n",
    "                        is_show=True,\n",
    "                        length=25,\n",
    "                        linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "                    ),)\n",
    "                        )\n",
    "        .set_series_opts(\n",
    "            itemstyle_opts={\n",
    "            \"normal\": {\n",
    "                \"color\": JsCode(\"\"\"new echarts.graphic.LinearGradient(0, 0, 0, 1, [{\n",
    "                    offset: 0,\n",
    "                    color: 'rgba(255,100,97,.5)'\n",
    "                }, {\n",
    "                    offset: 1,\n",
    "                    color: 'rgba(221,160,221)'\n",
    "                }], false)\"\"\"),\n",
    "                \"barBorderRadius\": [30, 30, 30, 30],\n",
    "                \"shadowColor\": 'rgb(0, 160, 221)',\n",
    "            }}\n",
    "        )\n",
    "    )\n",
    "    return c"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 14,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"488f910a6a4246c9868437d1b6904677\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_488f910a6a4246c9868437d1b6904677 = echarts.init(\n",
       "                    document.getElementById('488f910a6a4246c9868437d1b6904677'), 'white', {renderer: 'canvas'});\n",
       "                var option_488f910a6a4246c9868437d1b6904677 = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"plum\",\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"bar\",\n",
       "            \"legendHoverLink\": true,\n",
       "            \"data\": [\n",
       "                24,\n",
       "                29,\n",
       "                20,\n",
       "                12,\n",
       "                15\n",
       "            ],\n",
       "            \"showBackground\": false,\n",
       "            \"barMinHeight\": 0,\n",
       "            \"barCategoryGap\": \"60%\",\n",
       "            \"barGap\": \"30%\",\n",
       "            \"large\": false,\n",
       "            \"largeThreshold\": 400,\n",
       "            \"seriesLayoutBy\": \"column\",\n",
       "            \"datasetIndex\": 0,\n",
       "            \"clip\": true,\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 2,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"inside\",\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{c}%\"\n",
       "            },\n",
       "            \"itemStyle\": {\n",
       "                \"normal\": {\n",
       "                    \"color\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{                    offset: 0,                    color: 'rgba(255,100,97,.5)'                }, {                    offset: 1,                    color: 'rgba(221,160,221)'                }], false),\n",
       "                    \"barBorderRadius\": [\n",
       "                        30,\n",
       "                        30,\n",
       "                        30,\n",
       "                        30\n",
       "                    ],\n",
       "                    \"shadowColor\": \"rgb(0, 160, 221)\"\n",
       "                }\n",
       "            },\n",
       "            \"rippleEffect\": {\n",
       "                \"show\": true,\n",
       "                \"brushType\": \"stroke\",\n",
       "                \"scale\": 2.5,\n",
       "                \"period\": 4\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"xAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"rotate\": -30,\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{value}%\"\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"yAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 25,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"<5.42\",\n",
       "                \"5.42-7.50\",\n",
       "                \"7.50-9.58\",\n",
       "                \"9.58-11.66\",\n",
       "                \">11.66\"\n",
       "            ]\n",
       "        }\n",
       "    ],\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_488f910a6a4246c9868437d1b6904677.setOption(option_488f910a6a4246c9868437d1b6904677);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f4958e0>"
      ]
     },
     "execution_count": 14,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "bar_chart(statics_x, statics_y).render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 薪资与工作经验 - 饼状玫瑰图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 15,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "[5, 58, 30, 7, 0]"
      ]
     },
     "execution_count": 15,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByWorkExp']:\n",
    "    statics_y.append(i['percent'])\n",
    "    statics_x.append(i['workExp'] + ':' + str(i['aveSalary']))\n",
    "statics_y"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 16,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "[('1年以内:4763', 5),\n",
       " ('1-3年:5733', 58),\n",
       " ('3-5年:7663', 30),\n",
       " ('5-10年:10218', 7),\n",
       " ('10年以上:14839', 0)]"
      ]
     },
     "execution_count": 16,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "list(zip(statics_x, statics_y))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 17,
   "metadata": {},
   "outputs": [],
   "source": [
    "def pie_rosetype(data) -> Pie:\n",
    "    background_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    ")\n",
    "    c = (\n",
    "        Pie(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "        .add(\n",
    "            \"\",\n",
    "            list(data),\n",
    "            radius=[\"30%\", \"75%\"],\n",
    "            center=[\"45%\", \"50%\"],\n",
    "            rosetype=\"radius\",\n",
    "            label_opts=opts.LabelOpts(formatter=\"{b}: {c}\"),\n",
    "        )\n",
    "        .set_global_opts(title_opts=opts.TitleOpts(title=\"\"),\n",
    "                        )\n",
    "    )\n",
    "    return c"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 18,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"977271dc59ad451492a04c585677de6b\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_977271dc59ad451492a04c585677de6b = echarts.init(\n",
       "                    document.getElementById('977271dc59ad451492a04c585677de6b'), 'white', {renderer: 'canvas'});\n",
       "                var option_977271dc59ad451492a04c585677de6b = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"pie\",\n",
       "            \"clockwise\": true,\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"1\\u5e74\\u4ee5\\u5185:4763\",\n",
       "                    \"value\": 5\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"1-3\\u5e74:5733\",\n",
       "                    \"value\": 58\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"3-5\\u5e74:7663\",\n",
       "                    \"value\": 30\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"5-10\\u5e74:10218\",\n",
       "                    \"value\": 7\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"10\\u5e74\\u4ee5\\u4e0a:14839\",\n",
       "                    \"value\": 0\n",
       "                }\n",
       "            ],\n",
       "            \"radius\": [\n",
       "                \"30%\",\n",
       "                \"75%\"\n",
       "            ],\n",
       "            \"center\": [\n",
       "                \"45%\",\n",
       "                \"50%\"\n",
       "            ],\n",
       "            \"roseType\": \"radius\",\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{b}: {c}\"\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"1\\u5e74\\u4ee5\\u5185:4763\",\n",
       "                \"1-3\\u5e74:5733\",\n",
       "                \"3-5\\u5e74:7663\",\n",
       "                \"5-10\\u5e74:10218\",\n",
       "                \"10\\u5e74\\u4ee5\\u4e0a:14839\"\n",
       "            ],\n",
       "            \"selected\": {},\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_977271dc59ad451492a04c585677de6b.setOption(option_977271dc59ad451492a04c585677de6b);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f73c310>"
      ]
     },
     "execution_count": 18,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "pie_rosetype(zip(statics_x, statics_y)).render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 薪资与工作经验 - 饼图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 19,
   "metadata": {},
   "outputs": [],
   "source": [
    "background_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    ")\n",
    "c = (\n",
    "    Pie(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "    .add(\n",
    "        \"\",\n",
    "        list(zip(statics_x, statics_y)),\n",
    "        radius=[\"40%\", \"55%\"],\n",
    "        label_opts=opts.LabelOpts(\n",
    "            position=\"outside\",\n",
    "            formatter=\"{a|job}{abg|}\\n{hr|}\\n {b|{b}: }{per|{d}%}  \",\n",
    "            background_color=\"#eee\",\n",
    "            border_color=\"#aaa\",\n",
    "            border_width=1,\n",
    "            border_radius=4,\n",
    "            rich={\n",
    "                \"a\": {\"color\": \"#999\", \"lineHeight\": 22, \"align\": \"center\"},\n",
    "                \"abg\": {\n",
    "                    \"backgroundColor\": \"#e3e3e3\",\n",
    "                    \"width\": \"100%\",\n",
    "                    \"align\": \"right\",\n",
    "                    \"height\": 22,\n",
    "                    \"borderRadius\": [4, 4, 0, 0],\n",
    "                },\n",
    "                \"hr\": {\n",
    "                    \"borderColor\": \"#aaa\",\n",
    "                    \"width\": \"100%\",\n",
    "                    \"borderWidth\": 0.5,\n",
    "                    \"height\": 0,\n",
    "                },\n",
    "                \"b\": {\"fontSize\": 16, \"lineHeight\": 33},\n",
    "                \"per\": {\n",
    "                    \"color\": \"#eee\",\n",
    "                    \"backgroundColor\": \"#334455\",\n",
    "                    \"padding\": [2, 4],\n",
    "                    \"borderRadius\": 2,\n",
    "                },\n",
    "            },\n",
    "        ),\n",
    "    )\n",
    "    .set_global_opts(title_opts=opts.TitleOpts(title=\"\"))\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 20,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"080c4bf12ac94458bdc8e113ee4fa45a\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_080c4bf12ac94458bdc8e113ee4fa45a = echarts.init(\n",
       "                    document.getElementById('080c4bf12ac94458bdc8e113ee4fa45a'), 'white', {renderer: 'canvas'});\n",
       "                var option_080c4bf12ac94458bdc8e113ee4fa45a = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"pie\",\n",
       "            \"clockwise\": true,\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"1\\u5e74\\u4ee5\\u5185:4763\",\n",
       "                    \"value\": 5\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"1-3\\u5e74:5733\",\n",
       "                    \"value\": 58\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"3-5\\u5e74:7663\",\n",
       "                    \"value\": 30\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"5-10\\u5e74:10218\",\n",
       "                    \"value\": 7\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"10\\u5e74\\u4ee5\\u4e0a:14839\",\n",
       "                    \"value\": 0\n",
       "                }\n",
       "            ],\n",
       "            \"radius\": [\n",
       "                \"40%\",\n",
       "                \"55%\"\n",
       "            ],\n",
       "            \"center\": [\n",
       "                \"50%\",\n",
       "                \"50%\"\n",
       "            ],\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"outside\",\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{a|job}{abg|}\\n{hr|}\\n {b|{b}: }{per|{d}%}  \",\n",
       "                \"backgroundColor\": \"#eee\",\n",
       "                \"borderColor\": \"#aaa\",\n",
       "                \"borderWidth\": 1,\n",
       "                \"borderRadius\": 4,\n",
       "                \"rich\": {\n",
       "                    \"a\": {\n",
       "                        \"color\": \"#999\",\n",
       "                        \"lineHeight\": 22,\n",
       "                        \"align\": \"center\"\n",
       "                    },\n",
       "                    \"abg\": {\n",
       "                        \"backgroundColor\": \"#e3e3e3\",\n",
       "                        \"width\": \"100%\",\n",
       "                        \"align\": \"right\",\n",
       "                        \"height\": 22,\n",
       "                        \"borderRadius\": [\n",
       "                            4,\n",
       "                            4,\n",
       "                            0,\n",
       "                            0\n",
       "                        ]\n",
       "                    },\n",
       "                    \"hr\": {\n",
       "                        \"borderColor\": \"#aaa\",\n",
       "                        \"width\": \"100%\",\n",
       "                        \"borderWidth\": 0.5,\n",
       "                        \"height\": 0\n",
       "                    },\n",
       "                    \"b\": {\n",
       "                        \"fontSize\": 16,\n",
       "                        \"lineHeight\": 33\n",
       "                    },\n",
       "                    \"per\": {\n",
       "                        \"color\": \"#eee\",\n",
       "                        \"backgroundColor\": \"#334455\",\n",
       "                        \"padding\": [\n",
       "                            2,\n",
       "                            4\n",
       "                        ],\n",
       "                        \"borderRadius\": 2\n",
       "                    }\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"1\\u5e74\\u4ee5\\u5185:4763\",\n",
       "                \"1-3\\u5e74:5733\",\n",
       "                \"3-5\\u5e74:7663\",\n",
       "                \"5-10\\u5e74:10218\",\n",
       "                \"10\\u5e74\\u4ee5\\u4e0a:14839\"\n",
       "            ],\n",
       "            \"selected\": {},\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_080c4bf12ac94458bdc8e113ee4fa45a.setOption(option_080c4bf12ac94458bdc8e113ee4fa45a);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f745f40>"
      ]
     },
     "execution_count": 20,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c.render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 人数与年龄 - 柱状图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 21,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "['24岁以下', '25岁-29岁', '30岁-34岁', '35岁-39岁', '40岁-44岁', '45岁以上']\n",
      "[618717, 658818, 182196, 31708, 4971, 1996]\n"
     ]
    }
   ],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByAge']:\n",
    "    statics_x.append(i['ageRange'])\n",
    "    statics_y.append(i['people'])\n",
    "print(statics_x)\n",
    "print(statics_y)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 22,
   "metadata": {},
   "outputs": [],
   "source": [
    "def bar_chart_age(x, y) -> Bar:\n",
    "    background_color_js = (\n",
    "        \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "        \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    "    )\n",
    "    c = (\n",
    "        Bar(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "        #Bar()\n",
    "        .add_xaxis(x)\n",
    "        # .add_xaxis(searchcount.index.tolist()[:10])\n",
    "        # .reversal_axis()\n",
    "        .add_yaxis(\"\", y, \n",
    "                   label_opts=opts.LabelOpts(position='inside', formatter=\"{c}\"),\n",
    "                  color='plum', category_gap=\"60%\"\n",
    "                  )\n",
    "        .set_global_opts(xaxis_opts=opts.AxisOpts(axislabel_opts=opts.LabelOpts(rotate=-30, formatter=\"{value}\"),\n",
    "                                                 axisline_opts=opts.AxisLineOpts(is_show=False),),\n",
    "                        yaxis_opts=opts.AxisOpts(\n",
    "                            axislabel_opts=opts.LabelOpts(is_show=True),\n",
    "                        axisline_opts=opts.AxisLineOpts(is_show=False),\n",
    "                        axistick_opts=opts.AxisTickOpts(\n",
    "                        is_show=True,\n",
    "                        length=25,\n",
    "                        linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "                    ),)\n",
    "                        )\n",
    "        .set_series_opts(\n",
    "            itemstyle_opts={\n",
    "            \"normal\": {\n",
    "                \"color\": JsCode(\"\"\"new echarts.graphic.LinearGradient(0, 0, 0, 1, [{\n",
    "                    offset: 0,\n",
    "                    color: 'rgba(255,100,97,.5)'\n",
    "                }, {\n",
    "                    offset: 1,\n",
    "                    color: 'rgba(221,160,221)'\n",
    "                }], false)\"\"\"),\n",
    "                \"barBorderRadius\": [30, 30, 30, 30],\n",
    "                \"shadowColor\": 'rgb(0, 160, 221)',\n",
    "            }}\n",
    "        )\n",
    "    )\n",
    "    return c"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 23,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"2c20e25e7626477f9621bfb99ae4be14\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_2c20e25e7626477f9621bfb99ae4be14 = echarts.init(\n",
       "                    document.getElementById('2c20e25e7626477f9621bfb99ae4be14'), 'white', {renderer: 'canvas'});\n",
       "                var option_2c20e25e7626477f9621bfb99ae4be14 = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"plum\",\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"bar\",\n",
       "            \"legendHoverLink\": true,\n",
       "            \"data\": [\n",
       "                618717,\n",
       "                658818,\n",
       "                182196,\n",
       "                31708,\n",
       "                4971,\n",
       "                1996\n",
       "            ],\n",
       "            \"showBackground\": false,\n",
       "            \"barMinHeight\": 0,\n",
       "            \"barCategoryGap\": \"60%\",\n",
       "            \"barGap\": \"30%\",\n",
       "            \"large\": false,\n",
       "            \"largeThreshold\": 400,\n",
       "            \"seriesLayoutBy\": \"column\",\n",
       "            \"datasetIndex\": 0,\n",
       "            \"clip\": true,\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 2,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"inside\",\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{c}\"\n",
       "            },\n",
       "            \"itemStyle\": {\n",
       "                \"normal\": {\n",
       "                    \"color\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{                    offset: 0,                    color: 'rgba(255,100,97,.5)'                }, {                    offset: 1,                    color: 'rgba(221,160,221)'                }], false),\n",
       "                    \"barBorderRadius\": [\n",
       "                        30,\n",
       "                        30,\n",
       "                        30,\n",
       "                        30\n",
       "                    ],\n",
       "                    \"shadowColor\": \"rgb(0, 160, 221)\"\n",
       "                }\n",
       "            },\n",
       "            \"rippleEffect\": {\n",
       "                \"show\": true,\n",
       "                \"brushType\": \"stroke\",\n",
       "                \"scale\": 2.5,\n",
       "                \"period\": 4\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"xAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"rotate\": -30,\n",
       "                \"margin\": 8,\n",
       "                \"formatter\": \"{value}\"\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"24\\u5c81\\u4ee5\\u4e0b\",\n",
       "                \"25\\u5c81-29\\u5c81\",\n",
       "                \"30\\u5c81-34\\u5c81\",\n",
       "                \"35\\u5c81-39\\u5c81\",\n",
       "                \"40\\u5c81-44\\u5c81\",\n",
       "                \"45\\u5c81\\u4ee5\\u4e0a\"\n",
       "            ]\n",
       "        }\n",
       "    ],\n",
       "    \"yAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 25,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_2c20e25e7626477f9621bfb99ae4be14.setOption(option_2c20e25e7626477f9621bfb99ae4be14);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x108e3b820>"
      ]
     },
     "execution_count": 23,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "bar_chart_age(statics_x, statics_y).render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 月度平均薪资 - 折线图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 24,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "['2020年-3月', '2020年-4月', '2020年-5月', '2020年-6月', '2020年-7月', '2020年-8月', '2020年-9月', '2020年-10月', '2020年-11月', '2020年-12月', '2021年-1月', '2021年-2月']\n",
      "[5949, 5836, 5826, 5815, 5731, 5852, 5961, 6079, 6076, 6213, 6392, 6292]\n"
     ]
    }
   ],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByMonth']:\n",
    "    statics_x.append(i['year'] + '-' + i['month'])\n",
    "    statics_y.append(i['monthAveSalary'])\n",
    "print(statics_x)\n",
    "print(statics_y)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 25,
   "metadata": {},
   "outputs": [],
   "source": [
    "x_data = statics_x\n",
    "y_data = statics_y\n",
    "\n",
    "background_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    ")\n",
    "area_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#eb64fb'}, {offset: 1, color: '#3fbbff0d'}], false)\"\n",
    ")\n",
    "\n",
    "c_line_month = (\n",
    "    Line(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "    .add_xaxis(xaxis_data=x_data)\n",
    "    .add_yaxis(\n",
    "        series_name=\"薪资\",\n",
    "        y_axis=y_data,\n",
    "        is_smooth=True,\n",
    "        is_symbol_show=True,\n",
    "        symbol=\"circle\",\n",
    "        symbol_size=6,\n",
    "        linestyle_opts=opts.LineStyleOpts(color=\"#fff\"),\n",
    "        label_opts=opts.LabelOpts(is_show=True, position=\"top\", color=\"white\"),\n",
    "        itemstyle_opts=opts.ItemStyleOpts(\n",
    "            color=\"red\", border_color=\"#fff\", border_width=3\n",
    "        ),\n",
    "        tooltip_opts=opts.TooltipOpts(is_show=False),\n",
    "        areastyle_opts=opts.AreaStyleOpts(color=JsCode(area_color_js), opacity=1),\n",
    "    )\n",
    "    .set_global_opts(\n",
    "        title_opts=opts.TitleOpts(\n",
    "            title=\"薪资变化\",\n",
    "            pos_bottom=\"5%\",\n",
    "            pos_left=\"center\",\n",
    "            title_textstyle_opts=opts.TextStyleOpts(color=\"#fff\", font_size=16),\n",
    "        ),\n",
    "        xaxis_opts=opts.AxisOpts(\n",
    "            type_=\"category\",\n",
    "            boundary_gap=False,\n",
    "            axislabel_opts=opts.LabelOpts(rotate=-20, margin=30, color=\"#ffffff63\"),\n",
    "            axisline_opts=opts.AxisLineOpts(is_show=False),\n",
    "            axistick_opts=opts.AxisTickOpts(\n",
    "                is_show=True,\n",
    "                length=25,\n",
    "                linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "            ),\n",
    "            splitline_opts=opts.SplitLineOpts(\n",
    "                is_show=True, linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\")\n",
    "            ),\n",
    "        ),\n",
    "        yaxis_opts=opts.AxisOpts(\n",
    "            min_=7500,\n",
    "            type_=\"value\",\n",
    "            position=\"right\",\n",
    "            axislabel_opts=opts.LabelOpts(margin=20, color=\"#ffffff63\"),\n",
    "            axisline_opts=opts.AxisLineOpts(\n",
    "                linestyle_opts=opts.LineStyleOpts(width=2, color=\"#fff\")\n",
    "            ),\n",
    "            axistick_opts=opts.AxisTickOpts(\n",
    "                is_show=True,\n",
    "                length=15,\n",
    "                linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\"),\n",
    "            ),\n",
    "            splitline_opts=opts.SplitLineOpts(\n",
    "                is_show=True, linestyle_opts=opts.LineStyleOpts(color=\"#ffffff1f\")\n",
    "            ),\n",
    "        ),\n",
    "        legend_opts=opts.LegendOpts(is_show=False),\n",
    "    )\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 26,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"86177a08c79d49e58834e590465472e3\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_86177a08c79d49e58834e590465472e3 = echarts.init(\n",
       "                    document.getElementById('86177a08c79d49e58834e590465472e3'), 'white', {renderer: 'canvas'});\n",
       "                var option_86177a08c79d49e58834e590465472e3 = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"line\",\n",
       "            \"name\": \"\\u85aa\\u8d44\",\n",
       "            \"connectNulls\": false,\n",
       "            \"symbol\": \"circle\",\n",
       "            \"symbolSize\": 6,\n",
       "            \"showSymbol\": true,\n",
       "            \"smooth\": true,\n",
       "            \"clip\": true,\n",
       "            \"step\": false,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"2020\\u5e74-3\\u6708\",\n",
       "                    5949\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-4\\u6708\",\n",
       "                    5836\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-5\\u6708\",\n",
       "                    5826\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-6\\u6708\",\n",
       "                    5815\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-7\\u6708\",\n",
       "                    5731\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-8\\u6708\",\n",
       "                    5852\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-9\\u6708\",\n",
       "                    5961\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-10\\u6708\",\n",
       "                    6079\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-11\\u6708\",\n",
       "                    6076\n",
       "                ],\n",
       "                [\n",
       "                    \"2020\\u5e74-12\\u6708\",\n",
       "                    6213\n",
       "                ],\n",
       "                [\n",
       "                    \"2021\\u5e74-1\\u6708\",\n",
       "                    6392\n",
       "                ],\n",
       "                [\n",
       "                    \"2021\\u5e74-2\\u6708\",\n",
       "                    6292\n",
       "                ]\n",
       "            ],\n",
       "            \"hoverAnimation\": true,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"white\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"lineStyle\": {\n",
       "                \"show\": true,\n",
       "                \"width\": 1,\n",
       "                \"opacity\": 1,\n",
       "                \"curveness\": 0,\n",
       "                \"type\": \"solid\",\n",
       "                \"color\": \"#fff\"\n",
       "            },\n",
       "            \"areaStyle\": {\n",
       "                \"opacity\": 1,\n",
       "                \"color\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#eb64fb'}, {offset: 1, color: '#3fbbff0d'}], false)\n",
       "            },\n",
       "            \"tooltip\": {\n",
       "                \"show\": false,\n",
       "                \"trigger\": \"item\",\n",
       "                \"triggerOn\": \"mousemove|click\",\n",
       "                \"axisPointer\": {\n",
       "                    \"type\": \"line\"\n",
       "                },\n",
       "                \"showContent\": true,\n",
       "                \"alwaysShowContent\": false,\n",
       "                \"showDelay\": 0,\n",
       "                \"hideDelay\": 100,\n",
       "                \"textStyle\": {\n",
       "                    \"fontSize\": 14\n",
       "                },\n",
       "                \"borderWidth\": 0,\n",
       "                \"padding\": 5\n",
       "            },\n",
       "            \"itemStyle\": {\n",
       "                \"color\": \"red\",\n",
       "                \"borderColor\": \"#fff\",\n",
       "                \"borderWidth\": 3\n",
       "            },\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 0\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u85aa\\u8d44\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u85aa\\u8d44\": true\n",
       "            },\n",
       "            \"show\": false,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"xAxis\": [\n",
       "        {\n",
       "            \"type\": \"category\",\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": false,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 25,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"#ffffff63\",\n",
       "                \"rotate\": -20,\n",
       "                \"margin\": 30\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"boundaryGap\": false,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": true,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"2020\\u5e74-3\\u6708\",\n",
       "                \"2020\\u5e74-4\\u6708\",\n",
       "                \"2020\\u5e74-5\\u6708\",\n",
       "                \"2020\\u5e74-6\\u6708\",\n",
       "                \"2020\\u5e74-7\\u6708\",\n",
       "                \"2020\\u5e74-8\\u6708\",\n",
       "                \"2020\\u5e74-9\\u6708\",\n",
       "                \"2020\\u5e74-10\\u6708\",\n",
       "                \"2020\\u5e74-11\\u6708\",\n",
       "                \"2020\\u5e74-12\\u6708\",\n",
       "                \"2021\\u5e74-1\\u6708\",\n",
       "                \"2021\\u5e74-2\\u6708\"\n",
       "            ]\n",
       "        }\n",
       "    ],\n",
       "    \"yAxis\": [\n",
       "        {\n",
       "            \"type\": \"value\",\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"axisLine\": {\n",
       "                \"show\": true,\n",
       "                \"onZero\": true,\n",
       "                \"onZeroAxisIndex\": 0,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 2,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#fff\"\n",
       "                }\n",
       "            },\n",
       "            \"axisTick\": {\n",
       "                \"show\": true,\n",
       "                \"alignWithLabel\": false,\n",
       "                \"inside\": false,\n",
       "                \"length\": 15,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            },\n",
       "            \"axisLabel\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"color\": \"#ffffff63\",\n",
       "                \"margin\": 20\n",
       "            },\n",
       "            \"inverse\": false,\n",
       "            \"position\": \"right\",\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"min\": 7500,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": true,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\",\n",
       "                    \"color\": \"#ffffff1f\"\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"\\u85aa\\u8d44\\u53d8\\u5316\",\n",
       "            \"left\": \"center\",\n",
       "            \"bottom\": \"5%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"textStyle\": {\n",
       "                \"color\": \"#fff\",\n",
       "                \"fontSize\": 16\n",
       "            }\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_86177a08c79d49e58834e590465472e3.setOption(option_86177a08c79d49e58834e590465472e3);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f745cd0>"
      ]
     },
     "execution_count": 26,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c_line_month.render_notebook()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### 城市平均薪资 - 地图"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 27,
   "metadata": {},
   "outputs": [],
   "source": [
    "from pyecharts.charts import Map\n",
    "from pyecharts.faker import Faker"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 28,
   "metadata": {},
   "outputs": [],
   "source": [
    "statics_x = []\n",
    "statics_y = []\n",
    "for i in job_statics_data_json['zpData']['salaryByCity']:\n",
    "    if i['cityList']:\n",
    "        statics_x.append(i['cityList'][0]['cityAveMonthSalary'])\n",
    "    statics_y.append(i['provinceName'])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 29,
   "metadata": {},
   "outputs": [],
   "source": [
    "background_color_js = (\n",
    "    \"new echarts.graphic.LinearGradient(0, 0, 0, 1, \"\n",
    "    \"[{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false)\"\n",
    ")\n",
    "c = (\n",
    "    Map(init_opts=opts.InitOpts(bg_color=JsCode(background_color_js)))\n",
    "    .add(\"全国薪资\", [list(z) for z in zip(statics_y, statics_x)], \"china\")\n",
    "    .set_global_opts(\n",
    "        title_opts=opts.TitleOpts(title=\"\"),\n",
    "        visualmap_opts=opts.VisualMapOpts(max_=15000, min_=6000),\n",
    "    )\n",
    ")\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 30,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min', 'china':'https://assets.pyecharts.org/assets/maps/china'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"70a2f01af9854d258ba6489b91b112a5\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts', 'china'], function(echarts) {\n",
       "                var chart_70a2f01af9854d258ba6489b91b112a5 = echarts.init(\n",
       "                    document.getElementById('70a2f01af9854d258ba6489b91b112a5'), 'white', {renderer: 'canvas'});\n",
       "                var option_70a2f01af9854d258ba6489b91b112a5 = {\n",
       "    \"backgroundColor\": new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#c86589'}, {offset: 1, color: '#06a7ff'}], false),\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"map\",\n",
       "            \"name\": \"\\u5168\\u56fd\\u85aa\\u8d44\",\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"mapType\": \"china\",\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"\\u5317\\u4eac\",\n",
       "                    \"value\": 12061\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u4e0a\\u6d77\",\n",
       "                    \"value\": 11113\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5929\\u6d25\",\n",
       "                    \"value\": 5662\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u91cd\\u5e86\",\n",
       "                    \"value\": 5397\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u9ed1\\u9f99\\u6c5f\",\n",
       "                    \"value\": 5164\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5409\\u6797\",\n",
       "                    \"value\": 5831\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8fbd\\u5b81\",\n",
       "                    \"value\": 4923\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6cb3\\u5317\",\n",
       "                    \"value\": 5102\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5c71\\u897f\",\n",
       "                    \"value\": 4968\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u9655\\u897f\",\n",
       "                    \"value\": 6108\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5c71\\u4e1c\",\n",
       "                    \"value\": 5510\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u7518\\u8083\",\n",
       "                    \"value\": 5110\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6cb3\\u5357\",\n",
       "                    \"value\": 5617\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6c5f\\u82cf\",\n",
       "                    \"value\": 7858\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6e56\\u5317\",\n",
       "                    \"value\": 6518\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6d59\\u6c5f\",\n",
       "                    \"value\": 9428\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5b89\\u5fbd\",\n",
       "                    \"value\": 5983\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u798f\\u5efa\",\n",
       "                    \"value\": 5684\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6c5f\\u897f\",\n",
       "                    \"value\": 4988\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6e56\\u5357\",\n",
       "                    \"value\": 5683\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8d35\\u5dde\",\n",
       "                    \"value\": 4891\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u56db\\u5ddd\",\n",
       "                    \"value\": 6479\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5e7f\\u4e1c\",\n",
       "                    \"value\": 7081\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u4e91\\u5357\",\n",
       "                    \"value\": 4845\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5e7f\\u897f\",\n",
       "                    \"value\": 4676\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6d77\\u5357\",\n",
       "                    \"value\": 5290\n",
       "                }\n",
       "            ],\n",
       "            \"roam\": true,\n",
       "            \"aspectScale\": 0.75,\n",
       "            \"nameProperty\": \"name\",\n",
       "            \"selectedMode\": false,\n",
       "            \"zoom\": 1,\n",
       "            \"mapValueCalculation\": \"sum\",\n",
       "            \"showLegendSymbol\": true,\n",
       "            \"emphasis\": {}\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u5168\\u56fd\\u85aa\\u8d44\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u5168\\u56fd\\u85aa\\u8d44\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ],\n",
       "    \"visualMap\": {\n",
       "        \"show\": true,\n",
       "        \"type\": \"continuous\",\n",
       "        \"min\": 6000,\n",
       "        \"max\": 15000,\n",
       "        \"inRange\": {\n",
       "            \"color\": [\n",
       "                \"#50a3ba\",\n",
       "                \"#eac763\",\n",
       "                \"#d94e5d\"\n",
       "            ]\n",
       "        },\n",
       "        \"calculable\": true,\n",
       "        \"inverse\": false,\n",
       "        \"splitNumber\": 5,\n",
       "        \"orient\": \"vertical\",\n",
       "        \"showLabel\": true,\n",
       "        \"itemWidth\": 20,\n",
       "        \"itemHeight\": 140,\n",
       "        \"borderWidth\": 0\n",
       "    }\n",
       "};\n",
       "                chart_70a2f01af9854d258ba6489b91b112a5.setOption(option_70a2f01af9854d258ba6489b91b112a5);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x10f73c040>"
      ]
     },
     "execution_count": 30,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.8.6"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}
